<template>
  <div>{{formatDate}}</div>
</template>

<script>
export default {
  name: 'sxc-date-timer',
  props: {
    timeFormat: {
      type: String,
      default: 'YYYY-MM-DD dddd HH:mm:ss'
    },
    timeZone: {
      type: String,
      default: 'Asia/Shanghai'
    }
  },
  data () {
    return {
      date: new Date() // 实时时间
    }
  },
  computed: {
    // 设置一个函数来进行过滤
    formatDate () {
      const { timeFormat, timeZone, date } = this
      this.$moment.tz.setDefault(timeZone)
      return this.$moment(date).format(timeFormat)
    }
  },
  mounted () {
    this.timer = setInterval(() => {
      this.date = new Date()
    }, 1000)
  },
  beforeDestroy () {
    clearInterval(this.timer)
  }
}
</script>

<style lang="scss" scoped>
</style>
